import React, { useCallback, useState, useEffect } from "react"

import { Field_FormSave, Field_name_id } from "@/components/utils/field.list"
import { FileExtMeta, FormRender, FormUpload } from "@whzhuke/antd"
import { FormProps } from "@/components/modal/form.modal"
import adminMangerService from "@/services/admin.manger.service"
import adminRulesService from "@/services/admin.rules.service"
import useForm from "antd/es/form/hooks/useForm"
import { useWatch } from "antd/es/form/Form"
import { useFetch } from "@whzhuke/usehook"
import baseSystem from "@/services/base.system"
import goodsService from "@/services/goods.service"

interface Props {
  values?: any
}

const unitMap: Record<string, number> = {
  套: 1,
  件: 2,
  个: 3,
  台: 4
}

export const EditGoods: React.FC<Props & FormProps> = props => {
  const { values, onDone } = props
  const [form] = useForm<any>()
  const [unitOptions, setUnitOptions] = useState<Array<{ label: string; value: any }>>([])
  const [currencyOptions, setCurrencyOptions] = useState<Array<{ label: string; value: any }>>([])

  useEffect(() => {
    goodsService.unitslist({}).then(res => {
      setUnitOptions(res.data.map((item: any) => ({ label: item.key, value: unitMap[item.value] || item.value })))
    })
    goodsService.pricelist({}).then(res => {
      setCurrencyOptions(res.data.map((item: any) => ({ label: item.key, value: item.value })))
    })
  }, [])

  useEffect(() => {
    if (values?.unit && typeof values.unit === "string" && unitMap[values.unit] && unitOptions.length > 0) {
      form.setFieldsValue({ unit: unitMap[values.unit] })
    }
  }, [values, unitOptions, form])

  const onFinish = useCallback(
    data => {
      goodsService[values ? "edit" : "add"]({ ...data }).then(res => {
        onDone?.()
      })
    },
    [values, onDone]
  )
  const type = useWatch("type", form)
  return (
    <FormRender
      form={form}
      initialValues={
        values
          ? {
              ...values
            }
          : {
              currency: 1
            }
      }
      layout="horizontal"
      preserve={false}
      onFinish={onFinish}
      labelCol={{ span: 8 }}
      wrapperCol={{ span: 16 }}
      style={{ width: 600 }}
      fieldList={[
        values ? Field_name_id : undefined,
        {
          fieldType: "input",
          formItemConfig: { required: !0, name: "name", label: "产品名称" },
          config: { placeholder: "产品名称" }
        },

        {
          fieldType: "select",
          formItemConfig: {
            required: !0,
            name: "unit",
            label: "产品单位"
          },
          config: {
            placeholder: "请选择产品单位",
            options: unitOptions
          }
        },

        {
          fieldType: "radioGroup",
          formItemConfig: {
            required: !0,
            name: "currency",
            label: "货币选择"
          },
          config: {
            options: currencyOptions
          }
        },
        {
          fieldType: "number",
          formItemConfig: { required: !0, name: "marketPrice", label: "产品价格" },
          config: { placeholder: "产品价格", min: 0, precision: 2 }
        },
        {
          fieldType: "number",
          formItemConfig: {
            required: !0,
            name: "stockNums",
            label: "库存量"
          },
          config: { placeholder: "库存量", min: 0, precision: 2 }
        },
        {
          fieldType: "number",
          formItemConfig: { required: !0, name: "costPrice", label: "成本价" },
          config: { placeholder: "成本价", min: 0, precision: 2 }
        },
        {
          fieldType: "textArea",
          formItemConfig: { required: !0, name: "description", label: "产品描述" },
          config: { placeholder: "产品描述" }
        },
        {
          fieldType: "textArea",
          formItemConfig: { required: !0, name: "paramDes", label: "产品要求" },
          config: { placeholder: "产品要求" }
        },
        {
          fieldType: "diy",
          formItemConfig: {
            name: "imgPath",
            label: "产品文件",
            required: !0,
            rules: [{ required: !0, message: "请上传产品文件" }],
            normalize: v => v[0]
          },
          component: (
            <FormUpload
              apiService={baseSystem.upload}
              accept={FileExtMeta.documentImage.toString()}
              allowFile="documentImage"
              assetKey="public"
              apiParams={{ businessType: 4 }}
            />
          )
        },

        { ...Field_FormSave, formItemConfig: { wrapperCol: { offset: 8, span: 16 } } }
      ]}
      autoComplete="off"
    />
  )
}
